<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/static/js/jquery-3.4.1.js"></script>
</head>
<body>
<div>
    <label for="username">用户名:</label>
    <input id="username" type="text" style="width: 150px;" />
</div>
<div>
    <label for="username">密码:</label>
    <input id="password" type="password" style="width: 150px;" />
</div>
<button type="button" id="login_button">登录</button>
<button type="button" id="logout_button">推出</button>
</body>
<script type="text/javascript">
    $(function () {
        $("#login_button").click(function () {
            let data = {
                username: $("#username").val(),
                password: $("#password").val(),
            };
            $.ajax({
                /*设置请求方式*/
                type: "get",
                /*请求路径*/
                url: "/login/ajax",
                /*请求携带的参数*/
                data: data,
                /*是否异步*/
                async: true,
                /*返回的数据类型*/
                dataType:"json",//返回数据类型
                /*这个值是默认的传参方式, 默认可以不指定, 只有传递json时需要指定*/
                contentType: 'application/x-www-form-urlencoded',
                /*请求成功的回调函数*/
                success: function(response){
                    if (response.code === 200) {
                        window.location.href = "/page";
                    }
                }
            });
        });
        $("#logout_button").click(function () {
            window.location.href = '/logout';
        });
    })
</script>
</html>